<template>
  <h2>父级组件</h2>
  <h3>msg:{{ msg }}</h3>
  <button @click="msg += '===='">xixi</button>
  <hr>
  <childName :msg="msg" />
</template>

<script lang="ts">
//defineComponent函数，目的是定义一个组件，内部可以传入一个配置对象
import { defineComponent, ref } from 'vue';
//引入子级组件
import childName from './components/childName.vue'

//暴露出去一个定义好的组件
export default defineComponent({
  //当前组件的名字是APP
  name: 'App',
  //注册组件
  components: {
    childName
  },

  setup() {
    const msg = ref('hello world')
    return {
      msg
    }
  }
});
</script>